<!--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
	<title>Stylish Error Page Responsive Widget Template :: w3layouts</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="keywords" content="Stylish Error Page template Responsive, Login form web template,Flat Pricing tables,Flat Drop downs  Sign up Web Templates, Flat Web Templates, Login sign up Responsive web template, SmartPhone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design"
	/>
	<script>
		addEventListener("load", function () {
			setTimeout(hideURLbar, 0);
		}, false);

		function hideURLbar() {
			window.scrollTo(0, 1);
		}
	</script>
	<!-- Custom Theme files -->
	<link th:href="@{/css/style.css}" rel="stylesheet" type="text/css" media="all" />
	<!-- //Custom Theme files -->
	<!--pop-up-box-->
	<link th:href="@{/css/popuo-box.css}" rel="stylesheet" type="text/css" media="all" />
	<!--//pop-up-box-->
	<link rel="stylesheet" th:href="@{/css/font-awesome.css}">
	<!-- Font-Awesome-Icons-CSS -->
	<!-- web font -->
	
	    rel="stylesheet">
	<!-- //web font -->
</head>

<body>
	<div class="main-agileits">
		<h1>Stylish Error Page</h1>
		<!-- content -->
		<div class="mainw3-agileinfo form">
			<div class="agileits-subscribe">
				<div class="img-po-agile">
					<img th:src="@{/images/mmmmk.png}" alt="">
				</div>
				<div class="subscribe-w3lsbottom">
					<div class="w3l-page">
						<i class="fa fa-spinner" aria-hidden="true"></i>Stylish
					</div>
					<h6>Oooops.... Something is wrong</h6>
					<h2>404</h2>
					<a class="play-icon popup-with-zoom-anim" href="#small-dialog1">
						Newsletter</a>
				</div>
				<p class="page-agilemk">page not found</p>
				<div class="img-po-agile posi-sgile-2">
					<img th:src="@{/images/mmmmk2.png}" alt="">
				</div>
				<div class="clear"></div>
			</div>
		</div>
		<!-- //content -->
	</div>

	<!-- Popup -->
	<div class="main vlcone mfp-hide" id="small-dialog1">
		<h3>Why Are You Waiting..</h3>
		<p>Subscribe to our email newsletter</p>
		<div class="w3ls-form">
			<form action="#" method="post">
				<input type="email" placeholder="Subscribe" name="Subscribe" required="">
				<button class="btn1">
					<i class="fa fa-paper-plane" aria-hidden="true"></i>
				</button>
			</form>
		</div>
		<div class="agileits-info">
			<h5>(OR)</h5>
		</div>
		<div class="share-icons">
			<a class="facebook" href="#">
				<i class="fa fa-facebook" aria-hidden="true"></i>
			</a>
			<a class="pinterest" href="#">
				<i class="fa fa-pinterest-p" aria-hidden="true"></i>
			</a>
			<a class="twitter" href="#">
				<i class="fa fa-twitter" aria-hidden="true"></i>
			</a>
			<a class="google" href="#">
				<i class="fa fa-google-plus" aria-hidden="true"></i>
			</a>
			<a class="vk" href="#">
				<i class="fa fa-vk" aria-hidden="true"></i>
			</a>
		</div>
		</div>
		<!-- //Popup -->

		<!-- copyright -->
		<div class="w3copyright-agile">
			<p>© 2018 Stylish Error Page. All rights reserved | Design by
				<a href="http://w3layouts.com/" target="_blank">W3layouts</a>
			</p>
		</div>
		<!-- //copyright -->


		<!-- jquery -->
		<script th:src="@{/js/jquery-2.1.4.min.js}"></script>
		<!-- //jquery -->

		<!-- popup modal (for signin & signup)-->
		<script th:src="@{/js/jquery.magnific-popup.js}"></script>
		<script>
			$(document).ready(function () {
				$('.popup-with-zoom-anim').magnificPopup({
					type: 'inline',
					fixedContentPos: false,
					fixedBgPos: true,
					overflowY: 'auto',
					closeBtnInside: true,
					preloader: false,
					midClick: true,
					removalDelay: 300,
					mainClass: 'my-mfp-zoom-in'
				});

			});
		</script>

</body>

</html>